{% load echarts %}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>{{ page_title }}</title>
    {% block  include_css %}
        {% theme_css %}
    {% endblock %}
    {% block extra_css %}
    {% endblock %}
</head>

<body>
{% block nav %}
    <nav class="light-blue lighten-1" role="navigation">
        <div class="nav-wrapper container"><a id="logo-container" href="{% url 'dje_home' %}"
                                              class="brand-logo center">{{ site_title }}</a>
            {% for menu2 in nav.left_menus %}
                {% if menu2.children %}
                    <ul id="{{ menu2.slug }}" class="dropdown-content">
                        {% for item in menu2.children %}
                            {% if item.after_separator %}
                                <li class="divider"></li>
                            {% endif %}
                            <li>{% dw_widget item %}</li>
                        {% endfor %}
                    </ul>
                {% endif %}
            {% endfor %}
            <ul class="left hide-on-med-and-down">
                {% for menu2 in nav.left_menus %}
                    {% if menu2.children %}
                        <li><a class="dropdown-trigger" href="javascript:"
                               data-target="{{ menu2.slug }}">{{ menu2.text }}<i
                                class="material-icons right"></i></a></li>
                    {% else %}
                        <li>{% dw_widget menu2 %}
                        </li>
                    {% endif %}
                {% endfor %}

            </ul>

            <ul id="nav-mobile" class="right hide-on-med-and-down">
            {% for menu2 in nav.right_menus %}
                {% if menu2.children %}
                    <ul id="{{ menu2.slug }}" class="dropdown-content">
                        {% for item in menu2.children %}
                            {% if item.after_separator %}
                                <li class="divider"></li>
                            {% endif %}
                            <li>{% dw_widget item %}</li>
                        {% endfor %}
                    </ul>
                {% endif %}
            {% endfor %}
            </ul>
        </div>
    </nav>
{% endblock %}
{% block main_content %}
{% endblock %}
{% block footer %}
    <footer class="page-footer">
        <div class="container">
            <div class="row">
                <div class="col l6 s12">

                </div>
                <div class="col l4 offset-l2 s12">
                    {% if nav.footer_links %}
                        <h5 class="white-text">Links</h5>
                        <ul>
                            {% for item in nav.footer_links %}
                                <li>{% dw_widget item class_="grey-text text-lighten-3" %}</li>
                            {% endfor %}
                        </ul>
                    {% endif %}
                </div>
            </div>
        </div>
        <div class="footer-copyright">
            <div class="container">
                &copy;{{ copyright.year_range }}, Powered By {{ copyright.powered_by }}
            </div>
        </div>
    </footer>
{% endblock %}

{% block include_script %}
    {% theme_js %}
{% endblock %}

{% block extra_script %}
    <script type="text/javascript">
        $(document).ready(function () {
            $(".dropdown-trigger").dropdown();
        });
    </script>
{% endblock %}
</body>
</html>